body {
  display: flex;
  flex-direction: column;
}
.app-nearby {
  width: 100%;
  height: 100%;
  flex: 1;
  overflow-y: scroll;
  /* circle--附近 */
  .nearby {
    width: 100%;
    height: 100%;
    .near-user {
      width: 100%;
      padding: 0 20px 20px;
      background-color: #fff;
      .fol-img {
        justify-content: space-between;

        margin: 15px 0;
        .pimg {
          display: flex;
          align-items: center;
          img {
            width: 60px;
            height: 60px;
            border-radius: 50%;
          }
          p {
            display: inline-block;
            margin-left: 10px;
            i {
              font-style: normal;
              color: #9a9a9a;
              font-size: 14px;
            }
          }
        }
        button {
          border: none;
          color: #9a9a9a;
          background-color: #fff;
        }
      }
      .fol-name {
        font-size: 14px;
        span {
          color: #9a9a9a;
        }
      }
      .fol-trends {
        justify-content: space-between;
        flex-wrap: wrap;
        li {
          margin: 10px 0;
          width: 30%;
          height: 100px;
          background-color: #9a9a9a;
        }
      }
      ul:after {
        content: "";
        width: 30%;
        height: 0px;
        visibility: hidden;
    }
      .fol-comment {
        color: #8a8a8a;
        justify-content: space-between;
        p {
          display: inline-block;
        }
        span {
          margin-left: 10px;
        }
      }
    }
  }
}
